<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <!--  引入本地的vue.js文件-->
  <script src="../js/vue2.js"></script>
</head>
<body>

<!--
      {{}}    取值时无法识别h5标签     不会覆盖标签中的内容
    vue中常见的指令
      v-html:  在标签中可以添加一个 v-html属性 属性值就是需要动态获去的数据
             1.v-html="stuNo"      "stuNo"  ->不在表示字符串
             2.使用v-html 实现数据的动态操作 会覆盖标签中的原有内容
      v-text:  在标签中可以添加一个 v-text属性 属性值就是需要动态获去的数据
            1. 会覆盖标签中的原有内容
            2.不能识别h5标签的
-->

<div id="app">
    <p>学号:{{stuNo}}</p>
    <p>学号:<span v-html="stuNo"></span></p>
    <p>学号:<span v-text="stuNo">这时span标签中的默认值</span></p>
</div>


<script type="text/javascript">

  let vm = new Vue({
    el:'#app',
    data:{
      stuNo:'<b>1001</b>'
    }
  })

</script>

</body>
</html>